﻿@model ManagementSystem.Models.Plan

@{
    ViewBag.Title = "Create Project";
}

<h2>@ViewBag.Title</h2>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset class="form-horizontal">
        <legend>Plan</legend>

        <div class="control-group">
            @Html.LabelFor(model => model.Title, new { @class = "control-label" })
            <div class="controls">
                @Html.EditorFor(model => model.Title)
                @Html.ValidationMessageFor(model => model.Title, null, new { @class = "help-inline" })
            </div>
        </div>

        <div class="control-group">
            @Html.LabelFor(model => model.Description, new { @class = "control-label" })
            <div class="controls">
                @Html.EditorFor(model => model.Description)
                @Html.ValidationMessageFor(model => model.Description, null, new { @class = "help-inline" })
            </div>
        </div>
        <div class="control-group">
            @Html.LabelFor(model => model.Participants, new { @class = "control-label" })
            <div class="controls">
                @(Html.Kendo().MultiSelect()
                    .Name("participants") //The name of the multiselect is mandatory. It specifies the "id" attribute of the widget.
                    .DataTextField("UserName") //Specifies which property of the Product to be used by the multiselect as a text.
                    .DataValueField("Id") //Specifies which property of the Product to be used by the multiselect as a value.
                    .MinLength(3)
                    .Placeholder("Type project participant(s) username ...")
                    .Filter(FilterType.Contains)
                    .DataSource(source =>
                    {
                        source.Read(read =>
                        {
                            read.Action("GetParticipants", "Plans")
                                 .Data("onAdditionalData");  //Set the Action and Controller name
                        })
                        .ServerFiltering(true); //If true the DataSource will not filter the data on the client.
                    }))
            </div>
        </div>
        <div class="form-actions no-color">
            <input type="submit" value="Create" class="btn" />
        </div>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>
<script>
    function onAdditionalData() {
        console.log($("#participants").data('kendoMultiSelect').input.val())
        return {
            text: $("#participants").data('kendoMultiSelect').input.val()
        };
    }
</script>
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

